<template>
	<div class="app-container">
		<div>
			<el-button type="info" @click="back">返回</el-button>
		</div>
		<el-divider></el-divider>
		<el-row :gutter="20">
			<el-col :span="6" :xs="24">
				<member-card></member-card>
			</el-col>
			<el-col :span="18" :xs="24">
				<el-card>
					<el-tabs v-model="activeTab" @tab-click="handleClick">
						<el-tab-pane label="统计信息" name="statistics">
							<member-statistics-info v-if="activeTabStatus.statistics" :memberCode="memberCode"></member-statistics-info>
						</el-tab-pane>
						<el-tab-pane label="余额明细" name="balance">
							<member-account v-if="activeTabStatus.balance" :memberCode="memberCode" :accountType="accountType.balance"></member-account>
						</el-tab-pane>
						<el-tab-pane label="积分明细" name="integral">
							<member-account v-if="activeTabStatus.integral" :memberCode="memberCode" :accountType="accountType.integral"></member-account>
						</el-tab-pane>
						<el-tab-pane label="日志信息" name="loger">
						</el-tab-pane>
					</el-tabs>
				</el-card>
			</el-col>
		</el-row>
	</div>
</template>

<script>
	import { findMemberDetail} from '@/api/crm/member'
	import MemberCard from './components/MemberCard'
	import MemberStatisticsInfo from './components/MemberStatisticsInfo'
	import MemberAccount from './components/MemberAccount'
	export default {
		name: 'view-user',
		data() {
			return {
				memberBaseDetail: {},
				memberCode:'',
				accountType:{
					balance: 'balance',
					integral: 'integral'
				},
				activeTab:'statistics',
				activeTabStatus:{
					//默认第一个table
					statistics:true,
					balance:false,
					integral:false,
					loger:false
				}
				
			}
		},
		created() {
			this.memberCode = this.$route.query.memberCode
			this.view(this.$route.query.memberCode)
		},
		components:{
			MemberCard,
			MemberStatisticsInfo,
			MemberAccount
		},
		methods: {
			async view(val) {
				await findMemberDetail(val).then(res => {
					console.log(res)
					this.memberBaseDetail = res.data.responseData
				})
			},
			back() {
				this.$router.go(-1)
			},
			errorHandler(){
				return true
			},
			handleClick(tab){
				if(tab.name == 'statistics'){
					this.activeTabStatus.statistics = true
					this.activeTabStatus.balance = false
					this.activeTabStatus.integral = false
					this.activeTabStatus.loger = false
				}
				if(tab.name == 'balance'){
					this.activeTabStatus.statistics = false
					this.activeTabStatus.balance = true
					this.activeTabStatus.integral = false
					this.activeTabStatus.loger = false
				}
				if(tab.name == 'integral'){
					this.activeTabStatus.statistics = false
					this.activeTabStatus.balance = false
					this.activeTabStatus.integral = true
					this.activeTabStatus.loger = false
				}
				if(tab.name == 'loger'){
					this.activeTabStatus.statistics = false
					this.activeTabStatus.balance = false
					this.activeTabStatus.integral = false
					this.activeTabStatus.loger = true
				}
			}
		}
	}
</script>

<style>
</style>
